<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta name="renderer" content="webkit" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>个性定制</title>
    <link rel="stylesheet" href="../../lib/css/reset.min.css">
    <link rel="stylesheet" href="../../lib/css/swiper.min.css">
    <link rel="stylesheet" href="../../lib/css/animate.min.css">
    <link rel="stylesheet" href="../../css/all.min.css">

</head>

<body>
    <div class="app-wrap" v-cloak id="dingzhi">
        <header-top></header-top>
        <header-search-global></header-search-global>
        <comment-top-nav :topnavlist="topnavlist"></comment-top-nav>
        <a v-for="item,index in bigimg1" :href="item.href" v-if="index==0">
            <img :src="item.picture" class="rm-shop-i-bigimg1">
        </a>
        <div class="container">
            <p class="dz-title">
                <span class="title-zh">定制流程</span>
                <span class="title-en">Customization process </span>
            </p>
            <div class="dz-steps">
                <div v-for="step in liucheng">
                    <i class="icon-dz" :class="step.cls"></i>
                    <p class="line1">{{step.txt1}}</p>
                    <p class="line2">{{step.txt2}}</p>
                </div>
            </div>
            <p class="dz-title">
                <span class="title-zh">定制需求</span>
                <span class="title-en">Customized requirements </span>
            </p>
            <form action="">
                <div class="dz-form">
                    <div class="box-wrap">
                        <div class="title">
                            <span>收货人信息</span>
                            <span class="tip">请填写收货地址，方便我们为您邮寄面料样品</span>
                            <a href="" class="add">新增收获地址</a>
                        </div>
                        <address-group :list="addresslist" v-if="addresslist" @callback="getAddressId"></address-group>
                    </div>
                    <div class="box-wrap">
                        <div class="title">
                            <span>定制需求信息</span>
                        </div>
                        <ul class="dz-con-list">
                            <li>
                                <p class="title-2 mb-20">基本信息</p>
                                <!-- 性别 -->
                                <div class="radio-group mb-20">
                                    <span v-for="item in sexList" @click="clickGender(item.txt)">
                                        <i class="icon-radio" :class=" item.txt==sexCurrent ? 'r1' : 'r0' "></i>{{item.txt}}
                                    </span>
                                </div>
                                <!-- 年龄 -->
                                <div class="input-group">
                                    <div>
                                        <input placeholder="年龄" class="dz-input" v-model="age">
                                        <span class="unit">岁</span>
                                    </div>
                                </div>
                            </li>
                            <li>
                                <p class="title-2 mb-20">选择定制类型</p>
                                <div class="check-group">
                                    <span v-for="(item,index) in categoryParams" class="check-item" :class="{'active': index == customCurrent}" @click="clickCustomType(index)">{{item.type}}</span>
                                </div>
                            </li>
                            <!-- <template v-for="item,index in categoryParams">
                                <li v-show="index == customCurrent">
                                    <p class="title-2">选择技术要求{{index}}</p>
                                    <div v-for="(subitem,subindex) in item.attributeGroupParams[0].attributeParams">
                                        <p class="title-3">{{subitem.type}}</p>
                                        <div class="check-group">
                                            <span v-for="(subsunitem,subsunindex) in subitem.attributeValueParams" class="check-item" :class="{'active':optionMsg[index].radio[subindex]==subsunindex}">{{subsunitem.type}}</span>
                                        </div>
                                    </div>
                                    
                                </li>
                            </template> -->
                            <!-- 
                            <li v-if="attributeGroup.length">
                                <p class="title-2">选择技术要求</p>
                                <div v-for="(item,index) in attributeGroup[0].attributeParams">
                                    <p class="title-3">{{item.type}}</p>
                                    <check-group :list="item.attributeValueParams" val="attributeValueId" txt="type"></check-group>
                                </div>
                                <p class="title-3">{{fabricGroupParams.type}}</p>
                                <check-img-group :list="fabricGroupParams.fabricParams" val="fabricId" txt="type" v-if="fabricGroupParams.fabricParams"></check-img-group>
                            </li>
                            <li v-if="attributeGroup.length">
                                <p class="title-2">填写体型计量体数据</p>
                                <div v-for="(item,index) in attributeGroup[1].attributeParams">
                                    <p class="title-3">{{item.type}}</p>
                                    <check-group :list="item.attributeValueParams" val="attributeValueId" txt="type" v-if="item.showType == 'choiceBox'"></check-group>
                                    <div class="input-group" v-if="item.showType == 'textBox'">
                                        <div v-for="items in item.attributeValueParams">
                                            <input :placeholder="items.type" class="dz-input">
                                            <span class="unit">{{items.unit}}</span>
                                        </div>
                                    </div>
                                </div>
                            </li> 
                            -->
                            <li>
                                <p class="title-2 mb-20">填写其他要求</p>
                                <textarea class="dz-textarea" placeholder="请输入您的要求"></textarea>
                                <span class="dz-textarea-tip">（0-300字）</span>
                            </li>
                        </ul>
                    </div>
                    <div class="box-wrap">
                        <div class="title">
                            <span>定制需求信息</span>
                        </div>
                        <ul class="dz-con-list">
                            <li>
                                <counter :buynum="1" class="dz-conter" @callback="getBuyNum"></counter>
                            </li>
                        </ul>
                    </div>
                </div>
                <div class="dz-submit-wrap">
                    <button type="button" class="dz-submit" @click="btn_submint">提交需求</button>
                </div>
            </form>
        </div>
        <!-- 页脚 -->
        <com-footer></com-footer>
    </div>
    <script src="../../lib/js/vue.js"></script>
    <script src="../../lib/js/axios.min.js"></script>
    <script src="../../lib/js/swiper.min.js"></script>
    <!-- mock 数据 打包发布的时候记得移除 -->
    <script src="../../lib/js/mock.js"></script>
    <script src="../../js/all.min.js"></script>
    <script>
        dingzhi();
    </script>
</body>

</html>